<template>
	<button class="flexBtn">
		<view class="flexBtnImg">
			<image :src="arrowUpIcon"></image>
		</view>
		<view class="flexBtnText">
			<text>顶部</text>
		</view>
	</button>
</template>

<script>
	export default {
		data() {
			return {
				arrowUpIcon: require('../../static/index/arrowUpIcon.png'),
			};
		}
	}
</script>

<style scoped>
	.flexBtn {
		border-radius: 50%;
		height: 60upx;
		width: 60upx;
		background-color: #f7533e;
		padding: 0;
		color: #FFF;
		font-size: 20upx;
		position: fixed;
		bottom: 50upx;
		right: 17upx;
		z-index: 20;
	}
	
	.flexBtnImg{
		height: 40%;
	}
	.flexBtnText{
		height: 60%;
	}
	.flexBtn:after {
		border: 0;
	}
	
	.flexBtn image {
		width: 35.33upx;
		height: 18upx;
		display: block;
		margin: 8upx auto 0 auto;
	}
	.flexBtnText text{
		display: block;
		margin: -15upx auto 0 auto;
		font-weight: 100;
	}
</style>
